<template>
<div>
  <t-navbar title="My" :fixed="false" />

    <div>
      <t-cell-group class="t1" size="100%">
        <t-row>
          <t-col span="10" style="text-align: center;margin-left: 10px">
            <div style="font-size: 10px;margin-top: 5px"><span style="color: dodgerblue;font-size: 25px">{{user.username}} </span></div>
          </t-col>
        </t-row>
      </t-cell-group>
        <t-cell title="修改信息" @click="tz('/updateinfo')" arrow hover />
        <t-cell title="重置密码" @click="tz('/updatepass')" arrow hover />
        <t-cell title="私密日记" @click="tz('/hidediary')" arrow hover />
        <t-cell title="正念记录" @click="tz('/mindfulness')" arrow hover />
        <t-cell title="操作日志" @click="tz('/log')" arrow hover />
        <t-cell title="意见反馈" @click="tz('/')" arrow hover />
        <t-cell title="关于我们" @click="tz('/')" arrow hover />
    </div>
    <div style="margin-top: 10px">
      <t-button theme="primary" @click="tz('/')" block>退出账号</t-button>
    </div>
</div>
</template>

<script setup>
import {ref,onMounted} from "vue";
import {useRouter} from "vue-router";

const user=ref({})
const router=useRouter()

onMounted(()=>{
  let json=localStorage.getItem("user");
  user.value=JSON.parse(json)

})
const tz=(url)=>{
  router.push(url)
}
</script>

<style scoped>
.avatar {
  width: 96px;
  height: 96px;
  border-radius: 50%;
  overflow: hidden;
}
</style>